<template>
  <div>
    <!-- 只显示初始值，不关心变化 -->
    {{ title.text }}
    <button @click="change">改变试试</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      // 触发一次defineProperty
      // 不需要这次defineProperty,将数据冻结起来
      title: Object.freeze({
        // 冻结，避免defineProperty
        text: "我是标题",
      }),
    };
  },
  methods: {
    change() {
      this.title.text = "改变了啊";
      //   this.title = {
      //     text: "这样可以该",
      //   };
    },
  },
};
</script>

<style>
</style>